<template>
    <div class="discount">
         <div class="discount-title">
             优惠<i @click="discountcloseFn"></i>
         </div>
         <div class="discount-list" v-if="discountInfo.length > 0">
             <span>满减</span>
             <p>{{discountInfo.join(',')}}</p>
         </div>

       <!--   <div class="discount-list">
             <span>返云钻</span>
             <p>返3云钻</p>
         </div> -->
    </div>
</template>

<script>
    export default {
        props:{
            discountInfo:{
                type:Array
            }
        },
        data(){
            return {
               
            }
        },
        methods:{
            discountcloseFn(){
                this.$emit('discountcloseFn')
            }
        }
     
    }
</script>
<style lang="scss"  scoped>
    @function _($px) {
        $rem: $px/50;
        @return #{$rem}rem;
   }

 .discount-title {
    position: relative;
    height: _(80);
    line-height: _(80);
    position: relative;
    font-size: _(28);
    color: #444;
    letter-spacing: 0;
    text-align: center;
    i {
        position: absolute;
        right: _(28);
        top: _(28);
        width: _(25);
        height: _(25);
        background-size: 100% 100%;
        background-image: url('/static/images/store/volumeclose.png')
    }
  }

  .discount-list {
        padding: _(28) _(24);
        background-color: #fff;
        border-bottom: 1px solid #e5e5e5;
        font-size:0;

        span {
            display: inline-block;
            padding: _(4) _(10);
            border:1px solid #ff782d;
            border-radius: _(100);
            font-size: _(20);
            color: #ff782d;
            line-height: _(20);
            vertical-align: top;
        }
        p {
            display: inline-block;
            margin-left: _(10);
            max-width: _(620);
            font-size: _(24);
            color: #444;
            line-height:_(36);
        }    

        &:last-child{
             border-bottom:0;
        }
   }
    
</style>